<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/views/shared/taglib.jsp"%>
<%
	request.setAttribute("title", "奖金明细");
%>
<%@ include file="/WEB-INF/views/shared/master/weContentHeader.jsp"%>
<style>
.title {
	z-index: 0 !important;
}

.overflow-hidden {
	overflow: hidden;
}

.nav-ul {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	float: left;
	font-size: 0.8rem;
	color: #999;
	padding: 0.5em 0em;
}

.nav-ul>* {
	position: relative;
	float: left;
	list-style: none;
	margin: 0.2rem 0.4rem;
}

.nav-arrow {
	vertical-align: middle;
	max-height: 0.5rem;
	padding-left: 0.2rem;
	transform: translateY(-0.05rem);
}
.weui-cell__bd{
	color:black;
}
.weui-cell__bd span {
	font-size: 12px;
	color: #9b9b9b !important;
}

.weui-cell__ft p {
	font-size: 14px;
	color: black;
}

.weui-cells:before {
	border-top: none;
}

.weui-tabbar {
	position: fixed !important;
}

.weui-cell:active {
	background-color: rgba(180, 180, 180, 0.5);
}

</style>

<%@ include file="/WEB-INF/views/shared/master/weTitle.jsp"%>
<div class="goback" data-back-href="<c:url value='/wechat/acc/myWealth/myWealth'/>"></div>

<form class="findIncomeDetail" method="post" action="<c:url value='/wechat/acc/myWealth/incomeDetailList'/>">
	<input type="hidden" class="incomeState" name="incomeState" value="" />
	<input type="hidden" class="order" name="order" value="time" /> 
	<input type="hidden" class="upOrDown" name="upOrDown" value="desc" />
    <input type="hidden" class="startDate" name="startDate" value="1000/08/09" />
	<input type="hidden" class="endDate" name="endDate" value="9999/12/30" />
</form>

<div class="weui-tab"
	style="padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px; solid:solid #ea693f;border-bottom:1px solid #e5e5e5">
	<nav class="overflow-hidden toSearch" hidden>
		<ul class="nav-ul">
			<li id="chooseTime">
				<span>日期选择</span>
				<img class="nav-arrow up_down" alt="" src="<c:url value='/images/we/productList/arrow_down.png' />">
			</li>
			<li id="sort-by-time">
				<span>时间</span> 
				<img class="nav-arrow up_down" alt="" src="<c:url value='/images/we/productList/arrow_down.png' />">
			</li>
			<li style="color: #999">
				<input id="chooseType" type="text" style="border: none; width: 1.5rem; font-size: 0.8rem; color: #999" placeholder="来源" onchange="change()">
				<img class="nav-arrow up_down" alt="" src="<c:url value='/images/we/productList/arrow_down.png' />">
			</li>
			<li id="sort-by-income" style="margin-left: 5px">
				<span>奖金额度</span>
				<img class="nav-arrow up_down" alt="" src="<c:url value='/images/we/productList/arrow_down.png' />">
			</li>			
		</ul>
	</nav>
</div>

<div id="shareLevel" hidden style="border-bottom:1px solid #e5e5e5">
	<div class="weui-cell">
		<div class="weui-cell__hd">
			<label for="" class="weui-label">开始日期</label>
		</div>
		<div class="weui-cell__bd">
			<input id="startTime" class="weui-input" type="date" value="">
		</div>
	</div>
	<div class="weui-cell">
		<div class="weui-cell__hd">
			<label for="" class="weui-label">结束日期</label>
		</div>
		<div class="weui-cell__bd">
			<input id="endTime" class="weui-input" type="date" value="">
		</div>
	</div>
</div>

<div class="weui-panel_body"
	style="padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px;">

</div>

<%@ include file="/WEB-INF/views/shared/scripts/jquery.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/jqweui.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/tabmob.jsp"%>
<%@ include file="/WEB-INF/views/shared/master/weContentFooter.jsp"%>

<script type="text/javascript">

	var status = 0;
	var colorPrimary = "#999";
	var colorSelected = "#2196F3";
	var img_up = "<c:url value='/images/we/productList/arrow_up.png' />";
	var img_down = "<c:url value='/images/we/productList/arrow_down.png' />";
	var img_none = "<c:url value='/images/we/productList/arrow_none.png' />";

	$(function() {
		toselect();

		//点击按奖金价格排序
		$('#sort-by-income').click(function() {
			$(".up_down").attr("src", img_none);
			$(".select").hide();
			$("#shareLevel").hide();
			$("#incomeType").hide();
			$(".weui-panel_body").show();
			if (status == 0) {
				status = 1;
				$(this).css("color", colorSelected);
				$(this).children("img").attr("src", img_up);

				$(".order").val("incomeAccount");
				$(".upOrDown").val("asc");

			} else if (status == 1) {
				status = 2;
				$(this).children("img").attr("src", img_down);

				$(".order").val("incomeAccount");
				$(".upOrDown").val("desc");

			} else if (status == 2) {
				status = 1;
				$(this).children("img").attr("src", img_up);

				$(".order").val("incomeAccount");
				$(".upOrDown").val("asc");

			} else if (status == 3 || status == 4) {
				status = 1;
				$(this).css("color", colorSelected);
				$(this).children("img").attr("src", img_up);
				$(this).siblings().css("color", colorPrimary);
				$(this).siblings().children("img").attr("src", img_none);

				$(".order").val("incomeAccount");
				$(".upOrDown").val("asc");

			}
			toselect();
		});

		//点击按日期排序
		$('#sort-by-time').click(function() {
			$(".up_down").attr("src", img_none);
			$(".select").hide();
			$("#shareLevel").hide();
			/* $("#incomeType").hide(); */
			$(".weui-panel_body").show();
			if (status == 0) {
				status = 3;
				$(this).css("color", colorSelected);
				$(this).children("img").attr("src", img_up);

				$(".order").val("time");
				$(".upOrDown").val("asc");

			} else if (status == 3) {
				status = 4;
				$(this).children("img").attr("src", img_down);

				$(".order").val("time");
				$(".upOrDown").val("desc");

			} else if (status == 4) {
				status = 3;
				$(this).children("img").attr("src", img_up);

				$(".order").val("time");
				$(".upOrDown").val("asc");

			} else if (status == 1 || status == 2) {
				status = 3;
				$(this).css("color", colorSelected);
				$(this).children("img").attr("src", img_up);
				$(this).siblings().css("color", colorPrimary);
				$(this).siblings().children("img").attr("src", img_none);

				$(".order").val("time");
				$(".upOrDown").val("asc");

			}
			toselect();
		});
	});

	//ajax 传输数据
	function toselect() {
		var formData = $(".findIncomeDetail").serialize();
		var action = $(".findIncomeDetail").attr("action");
		var html = $.getText(action, formData);
		$(".weui-panel_body").html(html);
	}

	//把选项改为默认
	function toOriginal() {
		$(".up_down").attr("src", img_none);
		$(".incomeState").val("");
		$(".order").val("time");
		$(".upOrDown").val("desc");
		$(".startDate").val("1000/08/09");
		$(".endDate").val("9999/12/30");
	}

	$(function() {
		var time = 0;
		/* 日期选择是否点击  */
		$("#chooseTime").on("click", function() {
			/* $("#incomeType").hide(); */
			toOriginal();
			if (time == 0) {
				$("#shareLevel").show();
				time = 1;
				$("#startTime").on("change", function() {
					$(".select").hide();
					var time = $("#startTime").val();
					var date = new Date(Date.parse(time.replace(/-/g, "/")));
					$(".startDate").val(date);
					toselect();
				});
				$("#endTime").on("change", function() {
					$(".select").hide();
					var time = $("#endTime").val();
					var date = new Date(Date.parse(time.replace(/-/g, "/")));
					$(".endDate").val(date);
					toselect();
				});
			} else if (time == 1) {
				$("#shareLevel").hide();
				time = 0;
			}

		});
	});

	$(function() {
		/* 类型选择是否点击  */
		$("#chooseType").click(function() {
			toOriginal();
		});
		$("#chooseType").select({
			title : "选择来源",
			items : [ {
				title : "全部",
				value : "",
			}, {
				title : "服务奖",
				value : "serviceAward",
			}, {
				title : "孵化奖",
				value : "hatcheryAward",
			}, {
				title : "一级分享奖",
				value : "firstSharingAward",
			}, {
				title : "二级分享奖",
				value : "secondSharingAward",
			}, {
				title : "转入余额",
				value : "TransferToBalance",
			} ]
		});
	})
	function change() {
		$(".incomeState").val($("#chooseType").data("values"));
		$("#chooseType").val("来源");
		toselect();
	}
	
	 /* 右上角齿轮点击效果 */
	var isHide = 0;
	$(".fa-cog").click(function () {
		if(isHide == 0){
			$(".toSearch").show();
			isHide = 1;
		}else{
			$(".toSearch").hide();
			isHide = 0;
		}
	})
</script>
